<%@page import="java.util.HashMap"%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>IEPM - Statistics</title>
        <%@include file = "global/admin_include.jsp" %>
        <%
            HashMap am = new HashMap();
            Object obj = request.getSession().getAttribute("accessMap");
            if (obj == null) {
                response.sendRedirect("../admin.jsp");
            } else {
                am = (HashMap) obj;
                if (am.get("P").equals("false")) {
                    response.sendRedirect("accessDenied.jsp");
                }
            }
        %>

        <script type="text/javascript">
            $(document).ready(function(){
                var date = new Date();
                var toDate = formatDate(date);
                date.setMonth(date.getMonth()-1);
                var fromDate = formatDate(date);
                
                $('#exp_date_1').datebox({  
                    required:false,
                    editable:false
                });
                
                $('#exp_date_1').datebox('setValue', fromDate);
                
                $('#exp_date_2').datebox({  
                    required:false,
                    editable:false
                }); 
                
                $('#exp_date_2').datebox('setValue', toDate);

                $("#trDetailsPanel0").panel('close');
                $("#trDetailsPanel1").panel('close');
                $("#trDetailsPanel2").panel('close');
            });
            
            function formatDate(date) {
                var d  = date.getDate();
                var day = (d < 10) ? '0' + d : d;
                var m = date.getMonth() + 1;
                var month = (m < 10) ? '0' + m : m;
                var yy = date.getYear();
                var year = (yy < 1000) ? yy + 1900 : yy;
                var formatDate = day + "/" + month + "/" + year;
                return formatDate;
            }
            
            function onClickSearch() {
               
                var exp_date_1 = $("#exp_date_1").datebox('getValue');
                var exp_date_2 = $("#exp_date_2").datebox('getValue');
                
                getIndex(exp_date_1,exp_date_2);
            }
            
            function getIndex(exp_date_1,exp_date_2) {
                $.ajax({
                    type: "POST",
                    url: "../ChartServlet",
                    data: "action=getStatsData&exp_date_1="+exp_date_1+"&exp_date_2="+exp_date_2,
                    dataType: "json",
                    cache: false,
                    success: function(data){
                        
                        if(data.type!='error'){  
                            $("#trDetailsPanel0").panel('open');
                            $("#trDetailsPanel1").panel('open');
                            $("#trDetailsPanel2").panel('open');
                            
                            var totalResponse = data.totalResponse;
                            var totalCompletedResponse = data.totalCompletedResponse;
                            var totalAcceptedResponse = data.totalAcceptedResponse;
                            var industry = data.industry;
                        
                            var i = 0;
                            for(i=0;i<industry.length;i++) {
                                $("#trDetailsPanel"+i).panel('setTitle',"Statistics Report's Details ["+industry[i]+"]");
                                $("#totalResponse"+i).html(totalResponse[i]);
                                $("#totalCompletedResponse"+i).html(totalCompletedResponse[i]);
                                $("#totalAcceptedResponse"+i).html(totalAcceptedResponse[i]);
                            }  
                        }else{
                            $("#trDetailsPanel0").panel('close');
                            $("#trDetailsPanel1").panel('close');
                            $("#trDetailsPanel2").panel('close');
                            alertMsg(data);    
                        }
                          
                    }
                });  
            }
        </script>
    </head>
    <body>
        <form id="ff" method="post">
            <div style="padding:3px 2px;border-bottom:1px solid #ccc"><h2>Statistics</h2></div> 
            <br/>
            <div class="easyui-panel" title="Statistics Report" style="padding:0px;background:#fafafa;" collapsible="false" > 
                <table cellpadding="5">
                    <tr>
                        <td class="tableForms_label">Date Range:</td>
                        <td  class="tableForms_userInput" colspan="3">
                            <input name="exp_date_1" id="exp_date_1" type="text" size="10" readonly="readonly"/>
                            &emsp;to
                            &emsp;<input name="exp_date_2" id="exp_date_2" type="text" size="10" readonly="readonly"/> 
                        </td>
                        <td><a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-search" onclick="onClickSearch()"></a></td>
                        <td></td>
                        <td></td>
                    </tr>
                </table> 
            </div>
            <br/>
            <div id="trDetailsPanel0" name="trDetailsPanel0" class="easyui-panel" title="Statistics Report's Details" style="padding:0px;background:#fafafa;" collapsible="true"> 
                <table cellpadding="5" class="tableForms">
                    <tr>
                        <td class="tableForms_label">Total Responses: </td>  
                        <td class="tableForms_userInput"><label id="totalResponse0" name="totalResponse0"></label></td>  
                    </tr> 
                    <tr>
                        <td class="tableForms_label">Total Completed Responses: </td>  
                        <td class="tableForms_userInput"><label id="totalCompletedResponse0" name="totalCompletedResponse0"></label></td>  
                    </tr> 
                    <tr>
                        <td class="tableForms_label">Total Accepted Responses: </td>  
                        <td class="tableForms_userInput"><label id="totalAcceptedResponse0" name="totalAcceptedResponse0"></label></td>  
                    </tr> 
                </table>
            </div>
            <br/>
            <div id="trDetailsPanel1" name="trDetailsPanel1" class="easyui-panel" title="Statistics Report's Details" style="padding:0px;background:#fafafa;" collapsible="true"> 
                <table cellpadding="5" class="tableForms">
                    <tr>
                        <td class="tableForms_label">Total Responses: </td>  
                        <td class="tableForms_userInput"><label id="totalResponse1" name="totalResponse1"></label></td>  
                    </tr> 
                    <tr>
                        <td class="tableForms_label">Total Completed Responses: </td>  
                        <td class="tableForms_userInput"><label id="totalCompletedResponse1" name="totalCompletedResponse1"></label></td>  
                    </tr> 
                    <tr>
                        <td class="tableForms_label">Total Accepted Responses: </td>  
                        <td class="tableForms_userInput"><label id="totalAcceptedResponse1" name="totalAcceptedResponse1"></label></td>  
                    </tr> 
                </table>
            </div>
            <br/>
            <div id="trDetailsPanel2" name="trDetailsPanel2" class="easyui-panel" title="Statistics Report's Details" style="padding:0px;background:#fafafa;" collapsible="true"> 
                <table cellpadding="5" class="tableForms">
                    <tr>
                        <td class="tableForms_label">Total Responses: </td>  
                        <td class="tableForms_userInput"><label id="totalResponse2" name="totalResponse2"></label></td>  
                    </tr> 
                    <tr>
                        <td class="tableForms_label">Total Completed Responses: </td>  
                        <td class="tableForms_userInput"><label id="totalCompletedResponse2" name="totalCompletedResponse2"></label></td>  
                    </tr> 
                    <tr>
                        <td class="tableForms_label">Total Accepted Responses: </td>  
                        <td class="tableForms_userInput"><label id="totalAcceptedResponse2" name="totalAcceptedResponse2"></label></td>  
                    </tr> 
                </table>
            </div>
        </form>
    </body>
</html>
